/* Layout & Bakgrunn */
body {
    margin: 0;
    font-family: 'Segoe UI', sans-serif;
    /* Bakgrunnsgradienten din beholdes */
    background: linear-gradient(135deg, #b5cbe9 0%, #9fdfbf 100%);
    min-height: 100vh;
}

/* --- NYTT HEADER DESIGN (CREAM) --- */
.navbar {
    background-color: #faf6eb; /* Kremhvit bakgrunn */
    border-bottom: 1px solid #e5e5e5; /* Diskret grå linje */
    min-height: 160px; /* God plass til høy logo */
    padding: 1px 0;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
    position: relative; /* "sticky" - Menyen følger med når du scroller. "relative" for fastlåst */
    top: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
}

.container-nav {
    width: 100%;
    /* Dette bestemmer bredden på innholdet på store skjermer. 
       Du kan øke denne til 1400px hvis du vil ha det bredere på 4K, 
       men 1100px er standard og ser ofte ryddigst ut.
    */
    max-width: 1100px; 
    margin: 0 auto;
    display: flex;
    
    /* ENDRING: flex-start flytter menyen bort til logoen på venstre side */
    justify-content: flex-start; 
    
    /* ENDRING: gap styrer avstanden mellom Logo og Hjem-knappen */
    gap: 60px; 
    
    align-items: center;
    padding: 0 20px;
}

/* Logo-justeringer */
.nav-logo {
    max-height: 200px; /* Tillater stor logo */
    width: auto;
    /* margin-right er fjernet fordi vi bruker 'gap' i containeren over i stedet */
}

/* Vi skjuler tekst-tittelen siden logoen nå har tekst i seg */
.site-title {
    display: none;
}

/* Meny-lenker */
.main-nav ul {
    display: flex;
    gap: 30px; /* Avstand mellom selve menyknappene (Hjem - About) */
    list-style: none;
    margin: 0;
    padding: 0;
}

.main-nav a {
    text-decoration: none;
    color: #2c5e32; /* Mørkegrønn farge ("Vestskogen"-grønn) */
    font-weight: 600;
    font-size: 1.15rem; /* Litt større tekst */
    text-transform: uppercase; /* Gjør menyvalgene stilrene */
    letter-spacing: 1px;
    transition: color 0.3s ease;
}

.main-nav a:hover {
    color: #66cc99; /* Lysere grønn når du peker på lenkene */
}


/* --- INNHOLD --- */
.main-content { padding: 40px 20px; }
.postcard-container { max-width: 1100px; margin: 0 auto; }

/* Landing Boks (Stor boks på forside + undersider) */
.postcard {
    background: #fff;
    padding: 40px;
    border-radius: 15px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
    margin-bottom: 40px;
}

.post-title { font-size: 2.2rem; margin-bottom: 0.5rem; color: #333; }
.divider { border: 0; height: 3px; width: 60px; background: #ccc; margin: 20px 0; }
.post-content { line-height: 1.7; font-size: 1.1rem; color: #555; }

/* Knapper i landing boks */
.landing-footer { margin-top: 30px; display: flex; gap: 15px; }

.btn-primary, .btn-secondary {
    padding: 12px 25px;
    border-radius: 5px;
    text-decoration: none;
    font-weight: bold;
    transition: background 0.3s;
}

/* Oppdaterte knappefarger for å matche temaet bedre */
.btn-primary { 
    background: #2c5e32; /* Mørkegrønn */
    color: #fff; 
}
.btn-primary:hover { background: #1e4222; }

.btn-secondary { 
    background: #eee; 
    color: #333; 
}
.btn-secondary:hover { background: #ddd; }


/* --- NYHETSKORT (GRID) --- */
.section-label { 
    text-align: center; 
    margin: 40px 0 30px; 
    font-size: 2rem; 
    color: #2c5e32; /* Grønn overskrift */
    font-weight: bold;
}

.news-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 30px;
}

.news-card {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0,0,0,0.08);
    display: flex;
    flex-direction: column;
    transition: transform 0.3s ease;
}

.news-card:hover {
    transform: translateY(-5px); /* Liten bevegelse når man peker på kortet */
}

.card-image img { width: 100%; height: 200px; object-fit: cover; }

.card-body { padding: 25px; flex-grow: 1; display: flex; flex-direction: column; }

.card-body h2 { margin-top: 0; font-size: 1.4rem; }
.card-body h2 a { text-decoration: none; color: #333; }
.card-body p { color: #666; line-height: 1.6; }

.btn-read-more {
    margin-top: auto;
    display: inline-block;
    padding: 8px 18px;
    background: #888;
    color: #fff;
    text-decoration: none;
    border-radius: 4px;
    align-self: flex-start;
    font-size: 0.9rem;
}
.btn-read-more:hover { background: #666; }

/* Footer */
.site-footer { text-align: center; padding: 60px 0; color: #444; }
.fb-icon { width: 30px; margin-bottom: 10px; opacity: 0.8; }
.fb-icon:hover { opacity: 1; }

/* Mobil-tilpasning */
@media (max-width: 768px) {
    .navbar {
        min-height: auto;
        padding: 20px 0;
    }
    
    .container-nav { 
        flex-direction: column; /* Stapler logo over meny */
        justify-content: center; /* Sentrerer alt */
        gap: 20px; 
    }

    .nav-logo {
        max-height: 80px; /* Mindre logo på mobil */
        margin-right: 0;
    }

    .main-nav ul {
        gap: 20px;
        flex-wrap: wrap;
        justify-content: center; /* Sentrerer menyknappene */
    }
    
    .post-title { font-size: 1.8rem; }
}